<template>
<div style="width: 100%;margin-bottom: 15px" v-show="showTable()">
  <el-table
    :border="true"
    :row-class-name="tableRowStyleName"
    :cell-class-name="tableCellStyleName"
    :header-cell-class-name="tableHeaderCellStyleName"
    :stripe="true"
    ref="multipleTable"
    :data="tableFileList"
    tooltip-effect="dark"
    max-height="442"
    style="width: 100%;font-family: PingFangSC-Regular; font-size: 14px;">
    <el-table-column label="内置文件" align="center">
      <template slot-scope="scope">
        <span>{{scope.row.fileName?scope.row.fileName:scope.row.name}}</span>
      </template>
    </el-table-column>
    <el-table-column prop="pageNum" label="操作" align="center" width="250">
      <template slot-scope="scope">
        <el-button v-show="$publicJs.showPreviewBtn(scope.row,scope.row.fileName?'fileName':'name')" size="mini" @click="viewFile(scope.row)">预览</el-button>
        <el-button size="mini" @click="dlFile(scope.row)">下载</el-button>
      </template>
    </el-table-column>
  </el-table>
</div>
</template>

<script>
import {
  tableRowStyleGol,
  tableCellStyleGol,
  tableHeaderCellStyleGol
} from '@/utils/publicFun'
export default {
  name: 'cmsDetailRowFile',
  data(){
    return{
      tableRowStyleName: tableRowStyleGol,
      tableCellStyleName: tableCellStyleGol,
      tableHeaderCellStyleName: tableHeaderCellStyleGol,
    }
  },
  props: {
    tableFileList: {
      type: Array,
      default: () => []
    },
    showTable: {
      type: Function,
      default: () => {
        return false
      },
    }
  },
  watch:{
    'tableFileList': {
      handler(val){

      },
      deep: true
    }
  },
  methods:{
  /*  showPreviewBtn(val){
      if(val.hasOwnProperty('fileName')){
        if(val.fileName.split('.')[1].indexOf('xls')>-1){
          return false
        }
      }
    },*/
    //预览
    viewFile(e) {
      // this.$publicUpload.filePreview(e.id)
      this.$publicUpload.preView(e.id)
          .then(res => {
          })
    },
    //下载文件
    dlFile(e) {
      // this.$publicUpload.downloadFile(e)
      this.$publicUpload.checkFile(e.id, e.fileName?e.fileName:e.name)
    },
  },
}
</script>

<style scoped>

</style>
